const { defineConfig } = require('@vue/cli-service')
const AutoImport = require('unplugin-auto-import/webpack')
const Components = require('unplugin-vue-components/webpack')
const CompressionPlugin = require('compression-webpack-plugin')
const { ElementPlusResolver } = require('unplugin-vue-components/resolvers')
module.exports = defineConfig({
  transpileDependencies: true,
  lintOnSave: false,
  publicPath: process.env.NODE_ENV === 'production' ? './' : '/',
  productionSourceMap: false,
  chainWebpack (config) {
    config.plugin('compression-webpack-plugin')
      .use(new CompressionPlugin({
        algorithm: 'gzip',
        test: /\.js$|\.html$|.\css/, // 匹配文件名
        threshold: 10240, // 对超过10k的数据压缩
        minRatio: 0.8,
        deleteOriginalAssets: false // 不删除源文件
      }))
  },
  configureWebpack: config => {
    return {
      plugins: [
        AutoImport({
          resolvers: [ElementPlusResolver()]
        }),
        Components({
          resolvers: [ElementPlusResolver()]
        })
      ],
      optimization: {
        runtimeChunk: 'single',
        splitChunks: {
          chunks: 'all',
          maxInitialRequests: Infinity, // 最大并行请求数，为了以防万一，设置无穷大即可
          minSize: 200000, // 引入的模块大于20kb才做代码分割，官方默认20000，这里不用修改了
          maxSize: 600000, // 若引入的模块大于60kb，则告诉webpack尝试再进行拆分
          cacheGroups: {
            vendors: {
              test: /[\\/]node_modules[\\/]/, // 使用正则匹配node_modules中引入的模块
              priority: -10 // 优先级值越大优先级越高，默认-10，不用修改
            }
          }
        }
      }
    }
    // externals: {
    //   // vue: 'Vue',
    //   // 'vue-router': 'VueRouter',
    //   // vuex: 'Vuex',
    //   // codemirror5: 'Codemirror',
    //   // 'highlight.min.js': 'Hljs'
    // },
  },
  devServer: {
    proxy: {
      '/api': {
        target: 'http://localhost:8888', // 目标接口域名
        changeOrigin: true, // 是否跨域
        pathRewrite: {
          '^/api': '/' // 重写接口
        }
      }
    }
  }
})
